<template>
	<view class="w-100">
		<view class="flex-1 py-2 mt-2 border-bottom mx-3 row-ac" v-for="(item,index) in userreportList" :key="index">
			<view class="flex-1">
				<view class="font-s-45">{{ item.nickname || item.username }}</view>
				<view class="font-s-2 text-muted">{{ item.phone }}</view>
			</view>
			<view class="row-ac">
				<view class="font-s-3 text-muted">直推用户数</view>
				<view class="font-s-4">({{ item.total_descendants }})</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		userreportUrl
	} from '@/api/index.js';
	export default {
		data() {
			return {
				queryInfo: {
					page: 1,
					page_size: 30
				},
				userreportList: [],
			}
		},
		onReachBottom() {
			this.onReachBottomHandle();
		},
		onLoad() {
			this.init()
		},
		methods: {
			init() {
				this.getUserreport()
			},
			getUserreport() {
				this.$R.get(userreportUrl, this.queryInfo).then(res => {
					if (res.code == 200) {
						this.userreportList = res.data.list
						this.userreportTotal = res.data.total
					}
				})
			},
			onReachBottomHandle() {
				// 触底事件
				if (this.userreportTotal != this.userreportList.length) {
					this.queryInfo.page_size += 30;
					this.getUserreport()
				}
			},
		}
	}
</script>

<style>
</style>